<!doctype html>
<html>
<head>
	<meta charset="utf-8">
    <!-- 确保移动端全屏显示 不能缩放 -->
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
	<meta name="description" content="angular+bootstrap">
    <title>列表</title>
	<link href="/static/css/base/bootstrap.css" rel="stylesheet">
    <link href="/static/css/base/font-awesome.min.css" rel="stylesheet">
    <link href="/static/css/index.css" rel="stylesheet">
</head>
<body ng-app="articleListApp">
	<!-- 公共头部导航 start -->
	<div ng-include="'header'"></div>
	<!-- 公共头部导航 end -->
    <div class="container" style="width:90%" ng-controller="articleListController">
	   	<div class="row" ng-repeat="article in articleList">
			<main class="main-content">
				<article id="{{article.id}}" class="post">
					<div class="featured" title="推荐文章" ng-if="article.isRecommend==1">
						<i class="fa fa-start-pos fa-star"></i>
					</div>
					<div class="post-head">
						<h4 class="post-title">
						<a href="/article?id={{article.id}}">{{article.title}}</a>
						</h4>
						<div class="post-meta">
						<span class="author">
						作者：
						<a class="text" href="javascript:void(0)">{{article.displayName}}</a>
						</span>
						•
						<time class="post-date" datetime="{{article.createTime | date:'yyyy-MM-dd HH:mm:ss'}}" title="{{article.createTime | date:'yyyy-MM-dd HH:mm:ss'}}">{{article.createTime | date:'yyyy年MM月dd日'}}</time>
						</div>
					</div>
					<div class="post-content" ng-if="article.picture!=null && article.picture!=''">
						<a href="/article?id={{article.id}}">
							<img src="{{article.picture}}" width="30%" alt="{{article.title}}">
						</a>
						<div style="width:68%;float:right;">{{article.subtitle || article.content}}</div>
					</div>
					<div class="post-content" ng-if="article.picture ==null || article.picture ==''">
						<div>{{article.subtitle || article.content}}</div>
					</div>
					<div class="post-permalink">
						<a class="btn btn-default" href="/article?id={{article.id}}">阅读全文</a>
					</div>
				</article>
			</main>
		</div>
	</div>
	<!-- 公共底部导航 start -->
	<div ng-include="'footer'"></div>
	<!-- 回到头部 -->
	<a id="back-to-top" href="#" style="display: none;">
		<i class="fa fa-angle-up"></i>
	</a>
	<!-- 公共底部导航 end -->
    <script src="/static/js/base/jquery-3.1.1.min.js"></script>
   	<script src="/static/js/base/angular.min.js"></script>
    <script src="/static/js/base/bootstrap.min.js"></script>
    <script src="/static/js/base/bootstrapValidator.js"></script>
    <script src="/static/js/base/jquery-cookie.js"></script>
    <script src="/static/js/base/jquery.Query.js"></script>
    <script src="/static/js/main.js"></script>
    <script type="text/javascript">
	    var articleListApp = angular.module("articleListApp",[]);
	    var cateid = $.query.get("cateid");
	    articleListApp.controller("articleListController", function($scope, $http) {
	    	$http({
	    		method : "post",
	    		url : "/articleList/"+cateid+".json",
	    		data : {}
	    	}).success(function(dataResult) {
	    		var result =  dataResult.data.dataList;
	    		$scope.articleList = result;
	    	});
	    });
    </script>
</body>
</html>
